var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "maishu-jueying", "react", "./common/component"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    const maishu_jueying_1 = require("maishu-jueying");
    const React = require("react");
    const component_1 = require("./common/component");
    let ComponentContainer = class ComponentContainer extends React.Component {
        componentDidMount() {
            if (this.designer == null)
                return;
            let pageData = this.designer.pageData;
            let elementId = this.props.id;
            console.assert(elementId != null);
            console.assert(document.getElementById(elementId));
            console.log(`ComponentContainer:${elementId}`);
            $(this.element).sortable({
                axis: "y",
                stop: () => {
                    //==============================================================================================
                    // 对组件进行排序
                    console.assert(pageData.children != null);
                    let childComponentDatas = [];
                    let elements = this.element.querySelectorAll("li");
                    for (let i = 0; i < elements.length; i++) {
                        let childId = elements[i].getAttribute("data-component-id");
                        if (!childId)
                            continue;
                        console.assert(childId != null);
                        let child = pageData.children.filter(o => o.props.id == childId)[0];
                        console.assert(child != null);
                        childComponentDatas.push(child);
                    }
                    let childIds = childComponentDatas.map(o => o.props.id);
                    pageData.children = pageData.children.filter(o => childIds.indexOf(o.props.id) < 0);
                    pageData.children.push(...childComponentDatas);
                    //==============================================================================================
                },
                receive: (event, ui) => {
                    let componentData = JSON.parse(ui.helper.attr("component-data"));
                    console.assert(this.master.props.id);
                    console.assert(this.props.id != null);
                    componentData.props.parentId = this.props.id;
                    let elementIndex = 0;
                    ui.helper.parent().children().each((index, element) => {
                        if (element == ui.helper[0]) {
                            elementIndex = index;
                            return false;
                        }
                    });
                    let isFirst = elementIndex == 0;
                    let isLatest = elementIndex == ui.helper.parent().children().length - 1;
                    if (isFirst) {
                        this.designer.appendComponent(this.master.props.id, componentData, 0);
                    }
                    else if (isLatest) {
                        this.designer.appendComponent(this.master.props.id, componentData);
                    }
                    else {
                        let nextComponentDataId = ui.helper.parent().children()[elementIndex].getAttribute("data-component-id");
                        let componentIds = pageData.children.map(o => o.props.id);
                        let nextComponentDataIndex = componentIds.indexOf(nextComponentDataId);
                        console.assert(nextComponentDataId != null);
                        this.designer.appendComponent(this.master.props.id, componentData, nextComponentDataIndex);
                    }
                    ui.helper.remove();
                }
            });
            this.designer.componentPanel.attach((componentPanel) => {
                if (componentPanel == null)
                    return;
                setTimeout(() => {
                    componentPanel.addDropTarget(this.element);
                }, 1000);
            });
        }
        render() {
            return React.createElement(maishu_jueying_1.MasterPageContext.Consumer, null, args => {
                let master = this.master = args.master;
                let children = [];
                if (master.props && master.props.children) {
                    let arr;
                    if (Array.isArray(master.props.children)) {
                        arr = master.props.children;
                    }
                    else {
                        arr = [master.props.children];
                    }
                    children = arr.filter((o) => o.props.parentId != null && o.props.parentId == this.props.id);
                }
                return React.createElement(maishu_jueying_1.DesignerContext.Consumer, null, args => {
                    this.designer = args.designer;
                    if (!this.designer) {
                        return children;
                    }
                    return React.createElement("ul", { ref: e => this.element = this.element || e }, children.map((o, i) => React.createElement("li", { "data-component-id": o.props ? o.props.id : "", key: o.props ? o.props.id : i }, o)));
                });
            });
        }
    };
    ComponentContainer = __decorate([
        component_1.component()
    ], ComponentContainer);
    exports.ComponentContainer = ComponentContainer;
});
